import React, { Component } from 'react'
import style from './List.module.css'
import Item from '../Item/Item'


export class List extends Component {

    // 删除todo
    delTodo = (id) => {
        // console.log('list-del', id);
        this.props.delTodo(id) //将item的id传递给App
    };
    // 勾选、取消勾选
    changeTodo = (id, done) => {
        this.props.updateTodo(id, done)
    }

    render() {
        const { todos } = this.props
        return (
            <div className={style.list}>
                {
                    todos.map(todo => {
                        return <Item key={todo.id} {...todo} delTodo={this.delTodo} changeTodo={this.changeTodo} />
                    })
                }
            </div>
        )
    }
}

export default List
